<template>
  <div class="tobBtoC">
    <div class="contentTopTitle">
      <div class="fl">
        <div class="title">集团通报</div>
      </div>
    </div>
    <div>
      <el-form :inline="true" :model="form" label-width="60px" class="formList">
        <el-form-item label="账期" style="width: 18%">
          <el-date-picker
            v-model="form.year"
            type="month"
            placeholder="选择年"
            value-format="yyyyMM"
          ></el-date-picker>
        </el-form-item>
        <el-form-item >
          <el-button size="small" type="primary" @click="search()"
            >查询</el-button
          >
          <el-button size="small" type="orange" @click="exportExcel()">
            导出
          </el-button>
        </el-form-item>
      </el-form>
    </div>
    <div class="table-content clearfix">
      <div class="tableBox">
        <el-table
          v-loading="tableLoading"
          :data="tableData"
          style="width: 100%"
          class="tableTh28"
          height="67vh"
          border
          stripe
          :span-method="arraySpanMethod"
        >
         <el-table-column
            fixed
            label="指标项"
            prop="indexItem"
            min-width="100"
          ></el-table-column>
          <el-table-column
            fixed
            label="分类"
            prop="smallType"
            min-width="110"
          ></el-table-column>
           <el-table-column
            fixed
            label="分类一"
            prop="smallOne"
            min-width="140"
          ></el-table-column>
           <el-table-column
            fixed
            label="分类二"
            prop="smallTwo"
            min-width="200"
          ></el-table-column>


          <el-table-column
            :label="item.name"
            v-for="(item, index) in titles"
            :key="index"
            :prop="item.value"
            min-width="120"
          >
          </el-table-column>
        </el-table>
      </div>
    </div>
  </div>
</template>

<script>
import prefixAPI from "@/api/prefixAPI";
import { getCookie } from "@/common/js/cookie";
import { getSessionStorage } from "@/common/js/storage";
import { $budgetAPI } from "@/api";
import { mergeSpan } from "@/utils/mixin";

export default {
  name: "incomeICTCard",
  data() {
    return {
      form: {
        year: "",
        areaId: "",
        type: "0",
        checkList: [
          { index: "1", value: "数字平台及集成服务" },
          { index: "2", value: "云业务收入" },
          { index: "3", value: "大数据和AI收入" },
          { index: "4", value: "IDC" },
        ],
      },
      accountInfo: "",
      tableData0: [],
      time: {},
      tableData: [],
      tableLoading: true,
      //
      titles: [
        {
          name: "广东",
          value: "gd",
        },
        {
          name: "江苏",
          value: "js",
        },
        {
          name: "浙江",
          value: "zj",
        },

        {
          name: "上海",
          value: "sh",
        },
        {
          name: "四川",
          value: "sc",
        },
        {
          name: "福建",
          value: "fj",
        },
        {
          name: "南方21省",
          value: "south21",
        },
        {
          name: "全国31省",
          value: "country31",
        },
        {
          name: "浙江在31省排名",
          value: "rank31",
        },
        {
          name: "可比省排名",
          value: "rankComparable",
        },
      ],
      spanArr: ''
    };
  },
  computed: {
    params() {
      let obj = {
        token: getCookie("token"),
        areaId: this.form.areaId,
        year: this.form.year,
      };
      return obj;
    },
  },
  created() {
    // if (this.$route.query.row) {
    //   let row = this.$route.query.row;
    //   this.form.areaId = row.areaId;
    //   this.form.year = row.accMonth;
    //   this.resourceId = true;
    // } else {
    //   this.accountInfo = JSON.parse(getSessionStorage("accountInfo"));
    //   this.form.areaId = this.accountInfo.areaId;
    //   this.form.year = this.moment().format("YYYYMM");
    // }
  },
  mounted() {
    let that = this;

    that.accountInfo = JSON.parse(getSessionStorage("accountInfo"));
    that.form.areaId = that.accountInfo.areaId;
    that.form.year = that.moment().subtract(1, "months").format("YYYYMM");

    this.init();
    //   $budgetAPI.toBtoCmonth(
    //     {},
    //     (res) => {
    //       if (res || res.code == 0) {
    //         this.form.year = res.content;
    //         this.init();
    //       }
    //     },
    //     (err) => {}
    //   );
  },
  methods: {
     arraySpanMethod({ row, column, rowIndex, columnIndex }) {
      if (columnIndex == 0 || columnIndex == 1 || columnIndex == 2) {
        return this.spanArr && this.spanArr[rowIndex][columnIndex];
      }
    },
    //查询
    search() {
      let params = {
        month: this.form.year,
        areaId: this.form.areaId ? this.form.areaId : this.accountInfo.areaId
        // type: this.typeText.toString(),
      };
      this.listResourceData(params);
    },
    //导出
    exportExcel() {
      let areaId = this.form.areaId;
      let year = this.form.year;
      let token = getCookie("token");
      // let type = this.typeText.toString();

        if (process.env.NODE_ENV == "development") {
          window.location.href =
            prefixAPI.loc +
            "/api/incomeICTCard/getCliquesNoticeData?token=" +
            token +
            "&areaId=" +
            areaId +
            "&month=" +
            year;
        } else if (process.env.NODE_ENV == "production") {
          window.location.href =
            prefixAPI.hp +
            "/api/incomeICTCard/getCliquesNoticeData?token=" +
            token +
            "&areaId=" +
            areaId +
            "&month=" +
            year;
        }
      
    },
    listResourceData(params) {
      let that = this;

      that.tableLoading = true;
      $budgetAPI.getIncomeICTCard(
        params,
        (res) => {
          if (res.code == 0) {
            that.tableData = res.content;
            that.spanArr = mergeSpan(res.content, ['indexItem', 'smallType', 'smallOne']);
            that.tableLoading = false;
          } else {
            that.alertError(res);
          }
        },
        (err) => {}
      );
    },
    init() {
      let that = this;

      let params = {
        month: this.form.year,
      };
      this.listResourceData(params);
    },
  },
};
</script>

<style lang="scss" scoped>
.newUpToDownOrganization {
  .table-content {
    .table-header {
      display: flex;
      justify-content: space-between;
      .btn-right {
        display: flex;
      }
      .table-title {
        font-size: 14px;
        font-weight: bold;
        height: 30px;
        line-height: 30px;
        span {
          display: inline-block;
          width: 5px;
          height: 5px;
          background-color: #418ee9;
          border-radius: 1000%;
          overflow: hidden;
          margin-right: 10px;
          margin-bottom: 3px;
        }
      }
    }
    .content {
      position: relative;
      .fileName {
        position: absolute;
        right: 0;
        top: 15px;
      }
    }
  }
}
</style>
<style lang="scss">
.tobBtoC {
  .formList {
    .el-form-item.btnBox {
      margin-bottom: 0px;
      width: 24%;
      margin-right: 0;
      .el-form-item__content {
        display: flex;
        width: 100%;
      }
    }
  }
  .upload-demo {
    display: inline-block;
    margin: 0 15px;
  }
}
</style>
